<template>
  <div>
    <card ref="Card" v-show="tab">
      <div slot="header">
        <el-input placeholder="输入单号搜索" v-model="searchNumber" style="width: 160px" clearable @keyup.enter.native="getData"/>
        <el-button type="success" @click="getData" class="ml-10">搜索</el-button>
      </div>
      <el-table :data="formData">
        <el-table-column prop="number" label="订单号"/>
        <el-table-column prop="notes" label="问题描述"/>
        <el-table-column prop="currentName" label="当前网点"/>
        <el-table-column prop="createTime" label="创建日期">
          <template slot-scope="scope">
            <span>{{scope.row.createTime | formatDateTime}}</span>
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" align="center" width="80">
          <template slot-scope="scope">
            <el-button icon="el-icon-document-copy" @click.stop="tabPage(scope.row)" type="success"/>
          </template>
        </el-table-column>
      </el-table>
      <pagination ref="Pagination" @update="getData"/>
    </card>
    <detail ref="Detail" v-show="!tab" :tab.sync="tab" @update="getData"/>
  </div>
</template>

<script>
  import Detail from './detail'
  import {pageProblemOrderApi} from '@/api/fund'

  export default {
    name: "Not",
    components: {Detail},
    data() {
      return {
        tab: true,
        formData: [],
        problemState: 0,
        searchNumber: ''
      }
    },
    mounted() {
      this.getData()
    },
    methods: {
      getData() {
        let pagination = this.$refs.Pagination;
        let param = {
          current: pagination.current,
          size: pagination.size,
          problemState: this.problemState,
          number: this.searchNumber
        };
        this.$refs.Card.start();
        pageProblemOrderApi(param).then(result => {
          let response = result.resultParam.operationPage;
          this.formData = response.records;
          pagination.total = response.total;
          this.$refs.Card.stop();
        })
      },
      tabPage(obj) {
        let _this = this.$refs.Detail
        _this.id = obj.id
        _this.getData()
        this.tab = !this.tab
      }
    }
  }
</script>
